<template>
  <van-swipe :autoplay="3000" class="my-swipe">
    <van-swipe-item v-for="item in homeBanner" :key="item.acm">
      <a :href="item.link">
        <img v-lazy="item.image" @load="homeSwiperImgLoad" />
      </a>
    </van-swipe-item>
  </van-swipe>
</template>

<script>
export default {
  name: "HomeSwiper",
  props: {
    homeBanner: {
      type: Array,
      default() {
        return [];
      }
    }
  },
  data() {
    return {
      isLoad: false
    };
  },
  methods: {
    homeSwiperImgLoad() {
      if (!this.isLoad) {
        this.$emit("homeSwiperImgLoad");
        this.isLoad = true;
      }
    }
  }
};
</script>

<style scoped>
.my-swipe {
  width: 100%;
}
.my-swipe .van-swipe-item {
  height: 195px;
  text-align: center;
}
.my-swipe .van-swipe-item img {
  width: 100%;
}
</style>
